<!-- reviewDetail 页面内容 -->
<section class="reviewDetail container" ng-controller="reviewDetailCtrl">
    <!-- 面包屑导航 -->
    <div class="row margin-reset breadcrumb-row">
        <ol class="breadcrumb padding-reset">
            <li ng-click="goBack();"><a>审核订单</a></li>
            <li class="li-1"><a>订单详情</a></li>
            <li class="li-2"><a ng-click="goBack();">返回上一页</a></li>
        </ol>
    </div>

    <div class="row margin-reset content-row">
        <!-- 状态栏-竖栏 -->
        <div class="col-lg-1 col-md-1 col-sm-1 padding-reset hidden-xs">
            <ul class="list-group yf-shadow state-list-group">
                <li class="list-group-item disabled">订单进度</li>
                <li class="list-group-item" ng-repeat="(key, arr) in statesArrs track by key" ng-class="{'active': arrindex >= key}">
                    <div class="cricle">
                    </div>
                    <span>{{ arr.name }}</span>
                </li>
            </ul>
        </div>
        
        <div class="col-lg-11 col-md-11 col-sm-11 col-xs-12">
            <!-- 最新进展 -->
            <div class="row margin-reset new-step-row">
                <div class="panel yf-shadow">
                    <div class="panel-heading">
                        <h4>最新进展</h4>
                    </div>
                    <div class="panel-body">
                        <!-- 新订单的样式 -->
                        <div class="row margin-reset" ng-show="order.workflow_state == 'new'">
                            <div class="col-sm-1 col-xs-1">
                                <img class="img-circle" ng-src="{{ user.headimg.url }}?imageView2/1/w/200/h/200/interlace/1">
                            </div>
                            <div class="col-sm-11 col-xs-11">
                                <p>您生成了一个新订单，请耐心等待服务商接单！</p>
                                <p class="tip-info">{{ order.updated_at * 1000 | date: 'yyyy-MM-dd HH:mm'}}</p>
                            </div>
                            <div class="col-sm-12 col-xs-12">
                                <div class="pull-right cancel-block">
                                    您可以
                                    <a class="edit-btn" data-toggle="modal" data-target="#myModal" ng-if='user.id == order.customer_id'>编辑</a>
                                    <a class="cancel-btn" ng-click="deleteOrder(order.id);">取消订单</a>
                                </div>
                            </div>
                        </div>
                        <!-- 订单已被接受的样式 -->
                        <div class="row margin-reset" ng-show="order.workflow_state == 'appointed_measurement'">
                            <div class="col-sm-1 col-xs-1" ng-if="user_role != 2">
                                <img class="img-circle" ng-src="{{ order.customer_service_info.image }}?imageView2/1/w/200/h/200/interlace/1" onerror="this.src='components/mine/imgs/image.jpg'" style="width: 55px;height: 55px;">
                            </div>
                            <div class="col-sm-11 col-xs-11" ng-if="user_role != 2">
                                <div>
                                    <span class="name" ui-sref="merchant({ id: order.facilitator_id })" style="cursor: pointer;">
                                      {{order.customer_service_info.name}}
                                  </span> 接了您的订单，请耐心等待。
                                </div>
                                <div class="tip-info">{{ order.updated_at * 1000 | date: 'yyyy-MM-dd HH:mm'}}</div>
                            </div>
                        </div>
                        <!-- 订单以测量 -->
                        <div class="row margin-reset" ng-show="order.workflow_state == 'measured'">
                            <div class="col-sm-1 col-xs-1">
                                <img class="img-circle" ng-src="{{ order.customer_service_info.image }}?imageView2/1/w/200/h/200/interlace/1" onerror="this.src='components/mine/imgs/image.jpg'" style="width: 55px;height: 55px;">
                            </div>
                            <div class="col-sm-12 col-xs-12" style="padding: 0px 0px;">
                                <div>
                                    <span class="name" ui-sref='merchant({ id: order.facilitator_id })'>{{ order.service_info.name }}</span> 上传了{{ order.measure_pictures[0].length }}张测量文件，等待审核
                                </div>
                                <div class="tip-info">{{ order.updated_at * 1000 | date: 'yyyy-MM-dd HH:mm'}}</div>
                                <div preview-picture datas='order.measure_pictures[0]'></div>
                                <div class="edit-block" ng-show="(user.depart_node_id && !!!order.is_appoint) || ['manager'].indexOf(user.user_type) != -1">
                                    <div class="col-sm-9 col-xs-5" style="padding: 0px 0px;text-align: right;">
                                    		<button class="btn btn-mt-ok button_sty" ng-click="user.user_type == 'manager' ? confirmOrder(order.id): sendContent(order.id, flow, 'next')">审核通过</button>
                                    </div>
                                    <div class="col-sm-3 col-xs-7">
                                    		<button class="btn btn-mt-ok button_sty" ng-click="sendContent(order.id, {}, 'pre');" ng-if="addons.indexOf('5mutian_set_check') != -1">退回</button>
                                    </div>
                                	</div>
                            </div>
                        </div>

                        <!-- 用户和服务商在品牌商内容显示的状态 -->
                        <div class="row margin-reset" ng-show="order.workflow_state == 'appointed_installation'">
                            <div class="col-sm-2 col-xs-12 need-padding">
                                <img class="img-fang" ng-src="{{order.company_logo}}?imageView2/1/w/200/h/200/interlace/1" ng-if="order.company_logo" onerror="this.src='components/mine/imgs/image.jpg'" style="width: 55px;height: 55px;">
                            </div>
                            <div class="col-sm-10 col-xs-12">
                                <div class="">
                                    等待服务商安装
                                </div>
                                <div class="need-padding" ng-if='!order.install_date && user_role == 1'>
                                    等待服务商确认安装时间
                                </div>
                                <div ng-show="user_role == 1 &&  handleLists.order.indexOf(user.user_type) != -1">
                                    <div class="need-padding">指派安装师傅:</div>
                                    <div class="col-sm-3 col-xs-12 padding-reset">
                                        <input type="text" class='form-control mt_input' ng-value="order.service_info.name" data-toggle="modal" data-target="#servermodal" name="">
                                    </div>
                                    <div class="col-sm-12 col-xs-12 padding-reset need-padding">
                                        <div class="pull-right" ng-show="(user_role == 1 || handleLists.order.indexOf(user.user_type) != -1) && addons.indexOf('5mutian_production_information') != -1">
                                            <input type="file" name="images" id='xml-file' style="display:none;">
                                            <a ng-click="uploadFile();" class="btn btn-mt-ok" ng-if="order.state != 'xml'">上传门窗信息</a>
                                        </div>
                                        <a ng-click="updateTimeAndMaster(false, order);" class="btn btn-mt-ok"> 确定 </a>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- 已安装  确认安装 -->
                        <div class="row margin-reset" ng-show="['installed', 'confirm_installed'].indexOf(order.workflow_state) != -1">
                            <div class="col-sm-1 col-xs-1">
                                <img class="img-circle" ng-src="{{ order.service_info.image }}" data-action="zoom" alt="" onerror="this.src='components/mine/imgs/image.jpg'" style="width: 55px;height: 55px;">
                            </div>
                            <div class="col-sm-11 col-xs-11">
                                <!-- 用户支付和服务商自己发单自己支付 -->
                                <div class="need-padding">
                                    <span class="name" ui-sref='merchant({ id: order.facilitator_id })'>{{ order.service_info.name }}</span> 已安装完成
                                </div>
                                <div class="tip-info need-padding">{{ order.updated_at * 1000 | date: 'yyyy-MM-dd HH:mm'}}</div>
                                <div ng-if='order.is_company'>
                                    <!--<div ng-if='order.workflow_state == "installed"'>
                                        等待发单人确认安装
                                    </div>-->
                                    <!--ng-if='order.workflow_state == "confirm_installed"'-->
                                    <!--<div ng-if='order.workflow_state == "installed"'>
                                    		<div class="" ng-if="!order.manager_confirm && ['manager'].indexOf(user.user_type) != -1">
                                            <button class='btn btn-mt-ok' ng-click="corfirmInstall(order.id);">确认安装</button>
                                        </div>
                                    </div>-->
                                    <div ng-if='order.workflow_state == "confirm_installed" || order.workflow_state == "installed"'>
                                        <div class="" ng-if="!order.manager_confirm && ['manager'].indexOf(user.user_type) != -1">
                                            <button class='btn btn-mt-ok' ng-click="corfirmInstall(order.id);">确认安装</button>
                                        </div>
                                        <div class="line" ng-if="order.manager_confirm && ['finance'].indexOf(user.user_type) != -1">
                                            <button class='btn btn-default yf-btn' data-toggle="modal" data-target=".pay_modal">直接支付</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- 完成安装 -->
                        <div class="row margin-reset" ng-show="order.workflow_state == 'completed'">
                            <div class="col-sm-12 col-xs-12">
                                <div class="">{{ order.updated_at * 1000 | date: 'yyyy-MM-dd HH:mm'}}</div>
                                <div class="">
                                    订单已经完成
                                </div>
                            </div>
                        </div>

                        <!-- 订单已经取消 -->
                        <div class="row margin-reset" ng-if="order.workflow_state == 'canceled'">
                            <div class="col-sm-12 col-xs-12">
                                <p>{{ order.updated_at * 1000 | date: 'yyyy-MM-dd HH:mm'}}</p>
                                订单已经取消
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 订单详情 -->
            <div class="row margin-reset order-detail-row">
                <div class="panel yf-shadow">
                    <div class="panel-heading">
                        <h4>订单详情</h4>
                    </div>
                    <div class="panel-body">
                        <div class="row margin-reset">
                            <div class="col-sm-6 col-xs-12" style="padding: 0px 0px;">
                                <p>订单号：{{order.serial_number}}</p>
                                <p>姓名：{{ order.name }}</p>
                                <p>预估面积：{{order.square}}(㎡) / 品牌：{{order.company_name}}</p>
                                <p>
                                    地址：<span class="glyphicon glyphicon-map-marker"></span> {{ order.address }}
                                </p>
                                <p ng-if='!!order.order_no'>备注：{{order.order_no}}</p>
                                <p>销售提成：{{order.sale_commission | moneyint:true}}元</p>
                            </div>
                            <div class="col-sm-6 col-xs-12" style="padding: 0px 0px;">
                                <p ng-if='!order.mount_order'>预约测量时间：{{ order.booking_date * 1000 | date: 'yyyy-MM-dd HH:mm '}}</p>
                                <p ng-if='order.mount_order'>预约安装时间：{{ order.install_date * 1000 | date: 'yyyy-MM-dd HH:mm '}}</p>
                                <p>预估总价：{{ order.total_count | moneyint:true }}元</span>
                                </p>
                                <p>价格明细：测量{{ order.measure_amount | moneyint }}元 / 安装{{ (order.total * 100 - order.ship_price) | moneyint:true }}元 / 物流费{{ order.ship_price | moneyint:true }}元</p>
                                <!--<p>-->
                                		测量：<span ng-bind="order.customer_service_id ? order.customer_service_info.name : '暂无测量师傅'"></span> / 安装：<span ng-bind="order.facilitator_id ? order.service_info.name : '暂无安装师傅'"></span>
                                    <div class="pull-right edit-block" ng-if="order.state == 'xml'">
                                        <a style="margin-left: 5px;" ui-sref="productInfo({ id: order.id})"> 查看门窗信息</a>
                                    </div>
                                    <div class="pull-right edit-block" ng-if="['measured', 'appointed_installation', 'installed', 'confirm_installed'].indexOf(order.workflow_state) != -1 && handleLists.all.indexOf(user.user_type) != -1">
                                        您可以<a class="edit-btn" ng-click="changeOrderByRole(order.id, user);">修改</a>
                                    </div>
                                    
                                <!--</p>-->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 留言区 -->
            <div class="row margin-reset comment-row">
                <div class="panel yf-shadow">
                    <div class="panel-heading">
                        <h4>留言区</h4>
                    </div>
                    <div class="panel-body">
                        <div class="input-group" ng-if="order.workflow_state == 'measured'">
                            <input type="text" class="form-control comment-input" placeholder="留言内容" ng-model='flow.content' ng-enter="sendContent(order.id, flow, '确认');content=''">
                            <div class="input-group-btn">
                               <button class="btn btn-mt-ok" type="button" ng-click="sendContent(order.id, flow);">留言</button>
                            </div>
                        </div>
                        <div class="row margin-reset comment-list" ng-repeat="flow in order.flows track by $index">
                            <p class="author">
                                <h5>留言者：{{flow.user_name}}</h5>
                            </p>
                            <p class="time">时间：{{ flow.created_at * 1000 | date: 'yyyy-MM-dd HH:mm' }}</p>
                            <p class="content">内容：{{ flow.content }}</p>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 订单日志 -->
            <div class="row margin-reset record-row">
                <div journal order='order'></div>
            </div>
        </div>
    </div>
    <div class="modal fade common-modal" id='myModal' tabindex="-1" role="dialog" aria-labelledby="common-modal" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content yf-shadow">
                <div class="modal-header text-center">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h3 class="modal-title" id="common-modal">
                      编辑订单
                  </h3>
                </div>
                <div class="modal-body">
                    <form name='modalorderform1' role="form" novalidate autocomplete="false" ng-submit="putOrderDetail(modalorderform1.$invalid, editOrder);">
                        <div class="row">
                            <div class=" col-xs-offset-1 col-xs-10">
                                <div class="form-group">
                                    <label for="time">预约时间</label>
                                    <input class="changeflatpickr form-control mt_input" id='changeflatpickr' set-time time='editOrder.booking_date' type="text" placeholder="预约时间" required>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class=" col-xs-offset-1 col-xs-10">
                                <div class="form-group">
                                    <label for="person">预约人</label>
                                    <input type="text" class="form-control mt_input" ng-model='editOrder.name' ng-pattern="/^[A-Za-z0-9\u4e00-\u9fa5]{2,20}$/" name="person" placeholder="预约人" required>
                                </div>
                                <div class="form-group error-container" ng-show="ismodalorderform1 && (modalorderform1.person.$error.pattern || modalorderform1.person.$error.required)">
                                    请输入长度 2-20位的名字(中文，字母，数字组成)！
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class=" col-xs-offset-1 col-xs-10">
                                <div class="form-group">
                                    <label for="tel">联系电话</label>
                                    <input type="tel" class="form-control mt_input" ng-model='editOrder.tel' ng-pattern="/^1[34578]\d{9}$/" name="tel" placeholder="联系电话" required>
                                </div>
                                <div class="form-group error-container" ng-show="ismodalorderform1 && (modalorderform1.tel.$error.pattern || modalorderform1.tel.$error.required)">
                                    请输入有效手机号！
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class=" col-xs-offset-1 col-xs-10 text-center">
                                <button type="submit" class="btn mt_group_btn btn-block">保存修改</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- 确认支付modal -->
    <div class="modal fade common-modal pay_modal" id='payModal' tabindex="-1" role="dialog" aria-labelledby="common-modal">
        <div class="modal-dialog" role="document">
            <div class="modal-content yf-shadow">
                <div class="modal-header text-center">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h3 class="modal-title" id="common-modal">
                      确认支付
                  </h3>
                </div>
                <div class="modal-body">
                    <form name='payorderform' role="form">
                        <div class="form-group form-group-line">
                            <div class="row margin-reset">
                                <div class="col-xs-offset-1 col-xs-7 padding-reset text-left">
                                    测量师傅：{{order.customer_service_info.name}}
                                    <br> 安装师傅：{{order.service_info.name}}
                                </div>
                                <div class="col-xs-3 text-right state">总计</div>
                            </div>
                            <div class="row margin-reset">
                                <div class="col-xs-offset-1 col-xs-7 padding-reset text-left text-muted">
                                    价格明细：测量费用￥{{(order.measure_amount_after_comment + order.service_measure_amount) | moneyint:true}}<br>
                                    安装费用￥{{(order.installed_amount_after_comment + order.service_installed_amount - order.ship_price) | moneyint:true}}<br>
                                    平台服务费{{order.basic_tax | percent}} ￥{{order.basic_order_tax | moneyint:true}}<br>
                                    物流费 ￥{{ order.ship_price | moneyint:true }}<br>
                                </div>
                                <div class="col-xs-3 padding-reset text-right"><span class="money1">￥{{ order.amount_total_count | moneyint:true }}</span></div>
                            </div>
                        </div>
                        <div class="form-group form-group-line">
                            <div class="row margin-reset">
                                <div class="col-xs-offset-1 col-xs-6 padding-reset text-left">账户余额</div>
                                <div class="col-xs-4 padding-reset text-right"><span class="money2">￥{{ user.amount | moneyint: true }}</span></div>
                            </div>
                        </div>
                        <div class="row">
                            <div class=" col-xs-offset-1 col-xs-10 text-center">
                                <button type="submit" class="btn mt_group_btn btn-block" ng-disabled="payorderform.$invalid" ng-click="payOrder(order);">立即付款</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- 指定服务商 -->
    <div class="modal fade common-modal" id="servermodal" tabindex="-1" role="dialog" aria-labelledby="common-modal">
        <div class="modal-dialog" role="document">
            <div class="modal-content yf-shadow">
                <div class="modal-header text-center">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h3 class="modal-title" id="common-modal">
                          指定服务商
                    </h3>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-lg-offset-1 col-lg-10 col-md-offset-1 col-md-10 col-sm-offset-1 col-sm-10 col-xs-12">
                          <form role="form" class="search-input-group">
                              <div class="input-group">
                                  <input type="search" class="form-control mt_input" ng-model='keyword' ng-enter="getMaster(keyword);" placeholder="输入师傅的账号或姓名">
                                  <span class="input-group-btn">
                                      <button class="btn mt_group_btn" type="button" ng-click="getMaster(keyword);">搜索</button>
                                  </span>
                              </div>
                          </form>
                        </div>
                        <div class="col-lg-offset-1 col-lg-10 col-md-offset-1 col-md-10 col-sm-offset-1 col-sm-10 col-xs-12" ng-show='noperson' ng-bind='noperson' style="color: red;">
                        </div>
                        <div class="col-lg-offset-1 col-lg-10 col-md-offset-1 col-md-10 col-sm-offset-1 col-sm-10 col-xs-12">
                          <table class="table table-striped table-bordered table-condensed">
                              <thead ng-if="masters">
                                  <th>账号</th>
                                  <th>姓名</th>
                              </thead>
                              <tr ng-repeat="master in masters track by $index">
                                  <td ng-click="setMaster(master);">{{master.tel}}</td>
                                  <td ng-click="setMaster(master);">{{master.real_name}}</td>
                              </tr>
                          </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
